<template>
  <!-- -->
  <div class="root">
    <!-- 头部 -->
    <div class="hesder">
      <div class="login">
        <van-nav-bar
          :title="obj.name"
          left-arrow
          @click-left="$router.back()"
        />
      </div>
      <div class="goodslist">
        <van-image
          round
          width="15rem"
          height="15rem"
          :src="ImgUrl + obj.image_path"
        />
      </div>
      <div class="content">
        <p>{{ obj.description }}</p>
        <div class="title">
          <p>{{ obj.name }}</p>
        </div>
        <div class="score">
          <span>评分:</span>
          <van-rate
            void-icon="star"
            void-color="#ff9a0d"
            v-model="value"
            @change="onChange"
          />
        </div>
        <div class="sale">
          <p>
            月售{{ obj.satisfy_count }}单
            <span>售价{{ obj.specfoods[0].price }}￥起</span>
          </p>
        </div>
        <div class="Comments">
          <p>
            评论数:{{ obj.rating_count }} &nbsp; 好评率: {{ obj.satisfy_rate }}%
          </p>
          <!-- <p>{{ obj.tips }}</p> -->
        </div>
      </div>
    </div>
    <div>
      <shopFooter :total="total"></shopFooter>
    </div>
  </div>
</template>
<script>
import { menu } from "../api/user";
import shopFooter from "../components/shopFooter.vue";
// import index from "./index.vue";
import axios from "../utils/request";
export default {
  components: {
    shopFooter,
  },
  data() {
    return {
      // month_sales: 1000, //月售
      // Reviews: 739, //评论数量
      // selling: 100, //售价
      delivery: 5, //配送费
      favorable: "80%",
      value: 4, //评分星星数量
      user_id: 1,
      Price: 90, //价格
      ImgUrl: axios.defaults.baseURL + "/img/",
      user: [
        {
          name: "",
        },
      ],
      obj: [],
      total: {
        price: this.$route.query.price,
        packing_fee: this.$route.query.packing_fee,
      },
    };
  },
  created() {
    // 接收id
    this.obj = this.$route.query.obj;
    console.log(84, this.obj);
    // this.user=data
    // console.log(this.$route.params.id);
    // 拼接url地址
    // this.$route.query.id;
    // this.$route.params.id;
    // menu({ id: data }).then((res) => {
    //   // console.log(res);
    //   this.user = res.data;
    //   console.log(this.user);
    // });
  },

  methods: {
    showCarFn() {
      // this.$emit("showCarFn");
    },
    onChange(value) {
      this.$toast("当前评分：" + value);
    },
  },
};
</script>

<style lang="less" scoped>
body {
  position: relative;
}
/deep/.van-nav-bar {
  background-color: #3190e8;
  .van-nav-bar__title {
    color: #fff;
  }
  .van-nav-bar__arrow {
    color: #fff;
  }
}
.code {
  display: flex;
  background-color: #fff;

  input {
    width: 80%;
    border: none;
    margin-bottom: 20px;
  }
}
.van-image {
  margin: 0 auto;
  display: block;
  margin-top: 20px;
}
.content {
  margin-left: 10px;
  color: rgb(192, 183, 183);
  p,
  div {
    line-height: 30px;
  }
}

.sale {
  span {
    color: #ff6600;
  }
}
</style>